<script setup lang="ts">
import { computed } from "vue";
import { WorkloadType } from "../provider";
import {
  ClusterInfo,
  ConfigMap,
  DaemonSet,
  Deployment,
  Namespace,
  NodeInfo,
  Secret,
  Service,
  StatefulSet,
  Volume
} from "@/views/domain/kubeHud/api/k8s";
import { useI18n } from "vue-i18n";
import { useFormRule } from "@/views/domain/kubeHud/utils/rules";
import KSection from "@/views/domain/kubeHud/views/components/k-section/index.vue";
import KoNodeSelector from "@/views/domain/kubeHud/views/components/ko-workloads/ko-spec/ko-node-selector.vue";

type WorkloadEntity = Deployment | StatefulSet | DaemonSet | any;

type Prop = {
  type?: WorkloadType;
  readonly?: boolean;
  nodeList?: NodeInfo[];
  namespaceList?: Namespace[];
  serviceList?: Service[];
  secretList?: Secret[];
  configMapList?: ConfigMap[];
  clusterList?: ClusterInfo[];
  volumeList?: Volume[];
};

const { t } = useI18n();
const { NumberRule } = useFormRule();

const props = defineProps<Prop>();
const workload = defineModel<WorkloadEntity>();

const editSpec = computed(() => {
  if (typeIsJob.value) {
    return workload.value.spec.jobTemplate.spec.template.spec;
  } else {
    return workload.value.spec.template.spec;
  }
});

const typeIsReplicateSet = computed(
  () =>
    props.type === WorkloadType.Deployment ||
    props.type === WorkloadType.StatefulSet
);

const typeIsJob = computed(
  () => props.type === WorkloadType.Job || props.type === WorkloadType.CronJob
);
</script>

<template>
  <div class="w-full flex flex-col">
    <k-section
      :title="$t('business.workload.node_schedule')"
      check
      check-on-body
      :check-model="editSpec.nodeSelector"
      @check-changed="e => (editSpec.nodeSelector = e ? {} : undefined)"
    >
      <ko-node-selector
        v-model:spec="editSpec"
        :readonly="readonly"
        :node-list="nodeList"
      />
    </k-section>
  </div>
</template>
<style lang="scss" scoped></style>
